<template>
  <el-date-picker type="date" v-model="pickerValue" :placeholder="placeholder" :format="format"
    :picker-options="options" :value-format="valueFormat"></el-date-picker>
</template>
<script>
export default {
  name: 'ExpirePicker',
  props: {
    placeholder: String,
    value: {
      type: String,
      default: ''
    },
    valueFormat: {
      type: String,
      default: 'yyyy-MM-dd'
    },
    foreverValue: {
      type: String,
      default: 'forever'
    }
  },
  data() {
    return {
      options: {
        shortcuts: [{
          text: '长期有效', onClick(picker) {
            picker.$emit('pick', 'forever')
          }
        }]
      },
    }
  },
  computed: {
    pickerValue: {
      get() {
        if (this.value == this.foreverValue) {
          return new Date()
        } else {
          return this.value
        }
      },
      set(v) {
        this.$emit('input', (v == 'forever') ? this.foreverValue : v)
      }
    },
    format() {
      if (this.value == this.foreverValue) {
        return '长期有效'
      } else {
        return 'yyyy-MM-dd'
      }
    }
  }
}
</script>
